<!--客服-->
<div id="qq_content" class="qq_content" style="top: 222px;">
    <div id="contactsBlock" class="showContractsBlock">
        <div class="wechat_block">
            <img src="{$footcompany.web_site_wc_qrcode}" style="width:150px;">
            <p class="consult">微信咨询</p>
        </div>
        <div class="qq_block">
            <p class="kefu"><img src="/static/index/picture/kefu.png">咨询热线</p>
            <p class="phone">{$footcompany.web_site_phone}</p>
        </div>
    </div>
    <div class="qq_block">
        <a id="toggleText" href="javascript:toggleQQContact(this)" style="text-decoration: none;">收起</a>
    </div>
    <div class="kefuitem">
        <a id="back-to-to" href="#top">
            <img src="/static/index/picture/top.png" alt="顶部" class="kefuitemimg">
            <p class="hoverwhitep">回到顶部</p>
        </a>
    </div>
</div>
<style>
    /*右侧客服悬浮窗*/
    #qq_content {
        width: 175px;
        height: auto;
        background: #ffffff;
        position: absolute;
        right: 20px;
        top: 30%;
        z-index: 99;
        box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.07);
        font-size: 12px;
        text-align: center;
        padding: 20px 10px;
        colot: #666;
    }

    .qq_block, .wechat_block, .product_block {
        margin-bottom: 10px;
        padding-bottom: 10px;
        border-bottom: 1px #eee solid;
    }

    .wechat_block .consult {
        font-size: 16px;
        color: #666666;
        margin-top: 15px;
    }

    .qq_block img {
        width: 30px;
        height: 25px;
        margin: 0px 0px -3px -5px;
    }
    .qq_block a {
        color: #333;
    }
    .qq_block .kefu{
        font-size: 14px;
    }
    .qq_block .kefu img{
        width: 16px;
        height: 16px;
        margin: 3px;
    }
    .qq_block .phone{
        font-size: 18px;
        font-weight: bold;
        color: #236EFB;
    }
    .qq_block .qq_contact {
        font-size: 12px;
        display: block;
        margin: 10px auto;
        padding: 5px 5px;
        text-align: center;
        overflow: hidden;
        width: 120px;
        color: #FFF;
        background: #236EFB;
        border-radius: 4px;
    }
    .boteee img {
        width: 28px;
        height: 22px;
    }
    #qq_content .kefuitem {
        position: relative;
        cursor: pointer;
    }
    .hoverwhitep {
        margin-top: 5px;
    }
    .logo-box img {width:125px !important;height:50px !important;}
</style>
<script>

    function startMove_scroll() {
        var oDiv = document.getElementById("qq_content");
        var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
        var len = parseInt((document.documentElement.clientHeight - oDiv.offsetHeight) / 3 + 30 + 'px');
        startMove(scrollTop + len);
    }

    var timer = null;
    function startMove(iTarget) {
        var oDiv = document.getElementById("qq_content");
        clearInterval(timer);
        timer = setInterval(function() {
            var speed = (iTarget - oDiv.offsetTop) / 8;
            speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
            if(oDiv.offsetTop == iTarget) {
                clearInterval(timer);
            } else {
                oDiv.style.top = oDiv.offsetTop + speed + "px";
            }
        }, 10);
    }

    startMove_scroll();
    window.onscroll = function(){
        startMove_scroll();
    };
    function toggleQQContact(e) {
        $('#contactsBlock').toggleClass('showContractsBlock');
        if ($('#contactsBlock').hasClass('showContractsBlock')) {
            $('#contactsBlock').fadeIn();
            $('#toggleText').text('收起');
        } else {
            $('#contactsBlock').fadeOut();
            $('#toggleText').text('展开');
        }
    }
</script>
<footer id="footer" class="classic_footer" style="position: relative;left: 0px;bottom: 0px;width: 100%;">
    <!-- Container -->
    <div class="container footer-body">
        <div class="row clearfix">
            <div class="col-md-4 col-sm-4 col-xs-12 sm-mb-mobile">
                <div class="item item-1">
                    <div class="logo-box" style=" height: 60px;">
                        <a href="{$local_host}" title="{$footcompany.web_site_title}">
                        <img class="logo" src="{$footcompany.web_site_bolog}" style="width:150px;height: 56px;">
                        </a>
                    </div>
                    <p class="text" style="line-height: 30px;font-size: 14px;color: rgba(255,255,255,.6);display: block;text-align: justify;">{$footcompany.web_site_wc_introduce}</p>
                </div>
            </div>
            <!-- Column -->
            <div class="col-md-4 col-sm-4 col-xs-12 all-block-links sm-mb-mobile" style="margin-left: 150px;">
                <h6 class="uppercase" style="height: 60px; line-height: 1.6; font-size: 20px; color: #fff;">
                    <i class="fa fa-envelope mini-mr"></i>联系我们
                </h6>
                <p style="line-height: 30px; font-size: 14px; color: rgba(255,255,255,.6); display: block; text-align: justify;">咨询电话：{$footcompany.web_site_phone}</p>
                 <p style="line-height: 30px; font-size: 14px; color: rgba(255,255,255,.6); display: block; text-align: justify;">官方邮箱：{$footcompany.web_site_wc_email}</p>
            </div>
            <!-- End Column -->
            <!-- Column -->
            <div class="col-md-2 col-sm-4 col-xs-12 sm-mb-mobile all-block-links">
                <!-- Title -->
                <h6 style="height: 60px; line-height: 1.6; font-size: 20px; color: #fff;">
                    <i class="fa fa-map-marker mini-mr"></i>我们的地址
                </h6>
                <p style="line-height: 30px; font-size: 14px; color: rgba(255,255,255,.6); display: block; text-align: justify;">{$footcompany.web_site_address} </p>
            </div>
            <!-- End Column -->
        </div>
    </div>

    <div style="height: 1px;background: #2A2B2D;width: 1200px;margin: 0 auto;"></div>
    <!-- End Container -->
    <div class="footer-bottom" style="padding:8px;">
        <div class="container" >
            <div class="row clearfix calculate-height t-center-xs">
                <!-- Bottom Note -->
                <div class="col-sm-12 col-xs-12 table-im t-left height-auto-mobile t-center-xs xxs-mt-mobile">
                    <p class="v-middle" style="color:rgba(255,255,255,.6);text-align: center;padding:5px;">
                        <span>{$footcompany.web_site_wc_copyright}</span>
                        <span><a href="{$footcompany.web_site_icp_url}" rel="nofollow">{$footcompany.web_site_icp}</a></span>
                        <span><a href="{$footcompany.web_site_wc_ps_url}" rel="nofollow">{$footcompany.web_site_wc_ps}</a></span>
                        <!-- <span>{$footcompany.web_site_icp_url}</span> -->
                    </p>
                </div>
            </div>
        </div>
    </div>

        
</footer>
